<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8" isELIgnored="false" %>
<!DOCTYPE html>
<html>
<head>
<%@include file="/web/header.jsp" %>
<title>商品详情</title>
</head>
<body>
<!-- color switcher start -->
    <div class="color-switcher">
        <div class="color-switcher-inner">
            <div class="switcher-icon">
                <i class="fa fa-cog fa-spin"></i>
            </div>

            <div class="switcher-panel-item">
                <h3>Color Schemes</h3>
                <ul class="nav flex-wrap colors">
                    <li class="default active" data-color="default" data-toggle="tooltip" data-placement="top" title="Red"></li>
                    <li class="green" data-color="green" data-toggle="tooltip" data-placement="top" title="Green"></li>
                    <li class="soft-green" data-color="soft-green" data-toggle="tooltip" data-placement="top" title="Soft-Green"></li>
                    <li class="sky-blue" data-color="sky-blue" data-toggle="tooltip" data-placement="top" title="Sky-Blue"></li>
                    <li class="orange" data-color="orange" data-toggle="tooltip" data-placement="top" title="Orange"></li>
                    <li class="violet" data-color="violet" data-toggle="tooltip" data-placement="top" title="Violet"></li>
                </ul>
            </div>

            <div class="switcher-panel-item">
                <h3>Layout Style</h3>
                <ul class="nav layout-changer">
                    <li><button class="btn-layout-changer active" data-layout="wide">Wide</button></li>
                    <li><button class="btn-layout-changer" data-layout="boxed">Boxed</button></li>
                </ul>
            </div>

            <div class="switcher-panel-item bg">
                <h3>Background Pattern</h3>
                <ul class="nav flex-wrap bgbody-style bg-pattern">
                    <li><img src="<%=app %>/web/base/assets/img/bg-panel/bg-pettern/1.png" alt="Pettern"></li>
                    <li><img src="<%=app %>/web/base/assets/img/bg-panel/bg-pettern/2.png" alt="Pettern"></li>
                    <li><img src="<%=app %>/web/base/assets/img/bg-panel/bg-pettern/3.png" alt="Pettern"></li>
                    <li><img src="<%=app %>/web/base/assets/img/bg-panel/bg-pettern/4.png" alt="Pettern"></li>
                    <li><img src="<%=app %>/web/base/assets/img/bg-panel/bg-pettern/5.png" alt="Pettern"></li>
                    <li><img src="<%=app %>/web/base/assets/img/bg-panel/bg-pettern/6.png" alt="Pettern"></li>
                </ul>
            </div>

            <div class="switcher-panel-item bg">
                <h3>Background Image</h3>
                <ul class="nav flex-wrap bgbody-style bg-img">
                    <li><img src="<%=app %>/web/base/assets/img/bg-panel/bg-img/01.jpg" alt="Images"></li>
                    <li><img src="<%=app %>/web/base/assets/img/bg-panel/bg-img/02.jpg" alt="Images"></li>
                    <li><img src="<%=app %>/web/base/assets/img/bg-panel/bg-img/03.jpg" alt="Images"></li>
                    <li><img src="<%=app %>/web/base/assets/img/bg-panel/bg-img/04.jpg" alt="Images"></li>
                    <li><img src="<%=app %>/web/base/assets/img/bg-panel/bg-img/05.jpg" alt="Images"></li>
                    <li><img src="<%=app %>/web/base/assets/img/bg-panel/bg-img/06.jpg" alt="Images"></li>
                </ul>
            </div>
        </div>
    </div>
    <!-- color switcher end -->

    <div class="wrapper">

        <!-- header area start -->
        <header>

            <!-- header top start -->
            <div class="header-top-area bg-gray text-center text-md-left">
                <div class="container">
                    <div class="row">
                        <div class="col-lg-6 col-md-5">
                            <div class="header-call-action">
                                <a href="#">
                                    <i class="fa fa-envelope"></i>
                                    info@website.com
                                </a>
                                <a href="#">
                                    <i class="fa fa-phone"></i>
                                    0123456789
                                </a>
                            </div>
                        </div>
                        <div class="col-lg-6 col-md-7">
                            <div class="header-top-right float-md-right float-none">
                                <nav>
                                    <ul>
                                        <li>
                                            <div class="dropdown header-top-dropdown">
                                                <a class="dropdown-toggle" id="myaccount" data-toggle="dropdown"
                                                    aria-haspopup="true" aria-expanded="false">
                                                     	我的账户
                                                    <i class="fa fa-angle-down"></i>
                                                </a>
                                                <div class="dropdown-menu" aria-labelledby="myaccount">
                                                    <a class="dropdown-item" href="javascript:;" onclick="my()">我的账户</a>
                                                    <a class="dropdown-item" href="<%=app %>/web/front/login.jsp"> 登录</a>
                                                    <a class="dropdown-item" href="<%=app %>/web/front/register.jsp">注册</a>
                                                </div>
                                            </div>
                                        </li>
                                        <li>
                                            <a href="#">我的愿望清单</a>
                                        </li>
                                        <li>
                                            <a href="#">购物车</a>
                                        </li>
                                        <li>
                                            <a href="#">结账</a>
                                        </li>
                                    </ul>
                                </nav>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- header top end -->

            <!-- header middle start -->
            <div class="header-middle-area pt-20 pb-20">
                <div class="container">
                    <div class="row align-items-center">
                        <div class="col-lg-3">
                            <div class="brand-logo">
                                <a href="index.html">
                                    <img src="<%=app %>/web/base/assets/img/logo/logo.png" alt="brand logo">
                                </a>
                            </div>
                        </div> <!-- end logo area -->
                        <div class="col-lg-9">
                            <div class="header-middle-right">
                                <div class="header-middle-shipping mb-20">
                                    <div class="single-block-shipping">
                                        <div class="shipping-icon">
                                            <i class="fa fa-clock-o"></i>
                                        </div>
                                        <div class="shipping-content">
                                            <h5>工作时间</h5>
                                            <span>早上 - 下午: 8.00 - 18.00</span>
                                        </div>
                                    </div> <!-- end single shipping -->
                                    <div class="single-block-shipping">
                                        <div class="shipping-icon">
                                            <i class="fa fa-truck"></i>
                                        </div>
                                        <div class="shipping-content">
                                            <h5>免费送货</h5>
                                            <span>On order over $199</span>
                                        </div>
                                    </div> <!-- end single shipping -->
                                    <div class="single-block-shipping">
                                        <div class="shipping-icon">
                                            <i class="fa fa-money"></i>
                                        </div>
                                        <div class="shipping-content">
                                            <h5>保证退款 100%</h5>
                                            <span>30天无条件退货</span>
                                        </div>
                                    </div> <!-- end single shipping -->
                                </div>
                                <div class="header-middle-block">
                                    <div class="header-middle-searchbox">
                                        <input type="text" name="searchmore" placeholder="更多好货等你发现···">
                                        <button class="search-btn" onclick="search()"><i class="fa fa-search"></i></button>
                                    </div>
                                    <div class="header-mini-cart">
                                        <div class="mini-cart-btn">
                                            <i class="fa fa-shopping-cart" onclick="shopcar()"></i>
                                            <span class="cart-notification">?</span>
                                        </div>
                                        <div class="cart-total-price">
                                            <span>总计</span>
<!--                                             $50.00 -->
                                        </div>
<!--                                         <ul class="cart-list"> -->
<!--                                             <li> -->
<!--                                                 <div class="cart-img"> -->
<%--                                                     <a href="product-details.html"><img src="<%=app %>/web/base/assets/img/cart/cart-1.jpg" --%>
<!--                                                             alt=""></a> -->
<!--                                                 </div> -->
<!--                                                 <div class="cart-info"> -->
<!--                                                     <h4><a href="product-details.html">simple product 09</a></h4> -->
<!--                                                     <span>$60.00</span> -->
<!--                                                 </div> -->
<!--                                                 <div class="del-icon"> -->
<!--                                                     <i class="fa fa-times"></i> -->
<!--                                                 </div> -->
<!--                                             </li> -->
<!--                                             <li> -->
<!--                                                 <div class="cart-img"> -->
<%--                                                     <a href="product-details.html"><img src="<%=app %>/web/base/assets/img/cart/cart-2.jpg" --%>
<!--                                                             alt=""></a> -->
<!--                                                 </div> -->
<!--                                                 <div class="cart-info"> -->
<!--                                                     <h4><a href="product-details.html">virtual product 10</a></h4> -->
<!--                                                     <span>$50.00</span> -->
<!--                                                 </div> -->
<!--                                                 <div class="del-icon"> -->
<!--                                                     <i class="fa fa-times"></i> -->
<!--                                                 </div> -->
<!--                                             </li> -->
<!--                                             <li class="mini-cart-price"> -->
<!--                                                 <span class="subtotal">总计 : </span> -->
<!--                                                 <span class="subtotal-price">$88.66</span> -->
<!--                                             </li> -->
<!--                                             <li class="checkout-btn"> -->
<!--                                                 <a href="#">结账</a> -->
<!--                                             </li> -->
<!--                                         </ul> -->
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- header middle end -->

            <!-- main menu area start -->
            <div class="main-header-wrapper bdr-bottom1">
                <div class="container">
                    <div class="row">
                        <div class="col-lg-12">
                            <div class="main-header-inner">
                                <div class="category-toggle-wrap">
                                    <div class="category-toggle">
                                        	类别
                                        <div class="cat-icon">
                                            <i class="fa fa-angle-down"></i>
                                        </div>
                                    </div>
                                    
                                </div>
                                <div class="main-menu">
                                    <nav id="mobile-menu">
                                        <ul>
                                            <li class="active"><a ><i class="fa fa-home"></i>Home <i class="fa fa-angle-down"></i></a></li>
                                            <li class="static"><a >pages <i class="fa fa-angle-down"></i></a></li>
                                            <li><a >shop <i class="fa fa-angle-down"></i></a></li>
                                            <li><a >Blog <i class="fa fa-angle-down"></i></a></li>
                                            <li><a>关于 我们</a></li>
                                        </ul>
                                    </nav>
                                </div>
                            </div>
                        </div>
                        <div class="col-12 d-block d-lg-none">
                            <div class="mobile-menu"></div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- main menu area end -->

        </header>
        <!-- header area end -->
<!-- 以上为表头 -->
<!--         +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ -->
        <div class="breadcrumb-area">
            <div class="container">
                <div class="row">
                    <div class="col-12">
                        <div class="breadcrumb-wrap">
                            <nav aria-label="breadcrumb">
                                <ul class="breadcrumb">
                                    <li class="breadcrumb-item"><a >返回首页</a></li>
                                    <li class="breadcrumb-item"><a >商品</a></li>
                                    <li class="breadcrumb-item active" aria-current="page">商品详细</li>
                                </ul>
                            </nav>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        
        
        
        
        
        
        <!-- product details wrapper start -->
        <div class="product-details-wrapper">
            <div class="container">
                <div class="row">
                    <div class="col-lg-9">
                        <!-- product details inner end -->
                        <div class="product-details-inner" name="stars">
                            <div class="row">
                                <div class="col-lg-6">
                                    <div class="product-large-slider mb-20 slick-arrow-style_2">
<!--                                         <div class="pro-large-img img-zoom" id="img1"> -->
<%--                                             <img src="<%=app %>/web/base/assets/img/product/product-details-img1.jpg" alt="" /> --%>
<!--                                         </div> -->
<!--                                         <div class="pro-large-img img-zoom" id="img2"> -->
<%--                                             <img src="<%=app %>/web/base/assets/img/product/product-details-img2.jpg" alt=""/> --%>
<!--                                         </div> -->
                                        <div class="pro-large-img img-zoom" id="img3">
                                            <img src="<%=app %>/web/base/assets/img/product/product-details-img3.jpg" alt=""/>
                                        </div>
<!--                                         <div class="pro-large-img img-zoom" id="img4"> -->
<%--                                             <img src="<%=app %>/web/base/assets/img/product/product-details-img4.jpg" alt=""/> --%>
<!--                                         </div> -->
                                    </div>
                                    <div class="pro-nav slick-padding2 slick-arrow-style_2">
                                        <div class="pro-nav-thumb"><img src="<%=app %>/web/base/assets/img/product/product-details-img1.jpg" alt="" /></div>
                                        <div class="pro-nav-thumb"><img src="<%=app %>/web/base/assets/img/product/product-details-img2.jpg" alt="" /></div>
                                        <div class="pro-nav-thumb"><img src="<%=app %>/web/base/assets/img/product/product-details-img3.jpg" alt="" /></div>
                                        <div class="pro-nav-thumb"><img src="<%=app %>/web/base/assets/img/product/product-details-img4.jpg" alt="" /></div>
                                        <div class="pro-nav-thumb"><img src="<%=app %>/web/base/assets/img/product/product-details-img2.jpg" alt="" /></div>
                                    </div>
                                </div>
<!--                                 <div class="col-lg-6" name="stars"> -->
                                <div class="col-lg-6">
                                    <div class="product-details-des mt-md-34 mt-sm-34" >
                                        <h3><a ></a></h3>
                                        <div class="ratings">
                                            <span class="good"><i class="fa fa-star"></i></span>
                                            <span class="good"><i class="fa fa-star"></i></span>
                                            <span class="good"><i class="fa fa-star"></i></span>
                                            <span class="good"><i class="fa fa-star"></i></span>
                                            <span><i class="fa fa-star"></i></span>
                                            <div class="pro-review">
                                                <span>100 review(s)</span>
                                            </div>
                                        </div>
                                        <div class="customer-rev">
                                            <a >(78 customer review)</a>
                                        </div>
                                        <div class="pricebox">
                                            <span class="regular-price">$160.00</span>
                                        </div>
                                        <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.<br>
                                        Phasellus id nisi quis justo tempus mollis sed et dui. In hac habitasse platea dictumst. Suspendisse ultrices mauris diam. Nullam sed aliquet elit. Mauris consequat nisi ut mauris efficitur lacinia.</p>
                                        <div class="quantity-cart-box d-flex align-items-center">
                                            <div class="quantity">
                                                <div class="pro-qty"><input type="text" value="1"></div>
                                            </div>
                                            <div class="action_link">
                                                <a class="buy-btn" href="#">添加到购物车<i class="fa fa-shopping-cart"></i></a>
                                            </div>
                                        </div>
                                        <div class="useful-links mt-20">
                                            <a href="#" data-toggle="tooltip" data-placement="top" title="Compare"><i class="fa fa-refresh"></i>compare</a>
                                            <a href="#" data-toggle="tooltip" data-placement="top" title="Wishlist"><i class="fa fa-heart-o"></i>wishlist</a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <!-- product details inner end -->

                        <!-- product details reviews start -->
                        <div class="product-details-reviews mt-34">
                            <div class="row">
                                <div class="col-lg-12">
                                    <div class="product-review-info">
                                        <ul class="nav review-tab">
                                            <li>
                                                <a class="active" data-toggle="tab" href="#tab_one">description</a>
                                            </li>
                                            <li>
                                                <a data-toggle="tab" href="#tab_two">information</a>
                                            </li>
                                            <li>
                                                <a data-toggle="tab" href="#tab_three">reviews</a>
                                            </li>
                                        </ul>
                                        <div class="tab-content reviews-tab">
                                            <div class="tab-pane fade show active" id="tab_one">
                                                <div class="tab-one">
                                                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam fringilla augue nec est tristique auctor. Ipsum metus feugiat sem, quis fermentum turpis eros eget velit. Donec ac tempus ante. Fusce ultricies massa massa. Fusce aliquam, purus eget sagittis vulputate, sapien libero hendrerit est, sed commodo augue nisi non neque.</p>
                                                    <div class="review-description">
                                                        <div class="tab-thumb">
                                                            <img src="<%=app %>/web/base/assets/img/about/services.jpg" alt="">
                                                        </div>
                                                        <div class="tab-des mt-sm-24">
                                                            <h3>Product Information :</h3>
                                                            <ul>
                                                                <li>Donec non est at libero vulputate rutrum.</li>
                                                                <li>Morbi ornare lectus quis justo gravida semper.</li>
                                                                <li>Pellentesque aliquet, sem eget laoreet ultrices</li>
                                                                <li>Nulla tellus mi, vulputate adipiscing cursus eu, suscipit id nulla</li>
                                                                <li>Donec a neque libero.</li>
                                                                <li>Pellentesque aliquet, sem eget laoreet ultrices</li>
                                                                <li>Morbi ornare lectus quis justo gravida semper.</li>
                                                            </ul>
                                                        </div>
                                                    </div>
                                                    <p>Cras neque metus, consequat et blandit et, luctus a nunc. Etiam gravida vehicula tellus, in imperdiet ligula euismod eget. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nam erat mi, rutrum at sollicitudin rhoncus, ultricies posuere erat. Duis convallis, arcu nec aliquam consequat, purus felis vehicula felis, a dapibus enim lorem nec augue. Nunc facilisis sagittis ullamcorper.</p>
                                                    <p>Proin lectus ipsum, gravida et mattis vulputate, tristique ut lectus. Sed et lorem nunc. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aenean eleifend laoreet congue. Vivamus adipiscing nisl ut dolor dignissim semper. Nulla luctus malesuada tincidunt.</p>
                                                </div>
                                            </div>
                                            <div class="tab-pane fade" id="tab_two">
                                                <table class="table table-bordered">
                                                    <tbody>
                                                        <tr>
                                                            <td>color</td>
                                                            <td>black, blue, red</td>
                                                        </tr>
                                                        <tr>
                                                            <td>size</td>
                                                            <td>L, M, S</td>
                                                        </tr>
                                                    </tbody>
                                                </table>
                                            </div>
                                            <div class="tab-pane fade" id="tab_three">
                                                <form action="#" class="review-form">
                                                    <h5>1 review for Simple product 12</h5>
                                                    <div class="total-reviews">
                                                        <div class="rev-avatar">
                                                            <img src="<%=app %>/web/base/assets/img/about/avatar.jpg" alt="">
                                                        </div>
                                                        <div class="review-box">
                                                            <div class="ratings">
                                                                <span class="good"><i class="fa fa-star"></i></span>
                                                                <span class="good"><i class="fa fa-star"></i></span>
                                                                <span class="good"><i class="fa fa-star"></i></span>
                                                                <span class="good"><i class="fa fa-star"></i></span>
                                                                <span><i class="fa fa-star"></i></span>
                                                            </div>
                                                            <div class="post-author">
                                                                <p><span>admin -</span> 30 Nov, 2018</p>
                                                            </div>
                                                            <p>Aliquam fringilla euismod risus ac bibendum. Sed sit amet sem varius ante feugiat lacinia. Nunc ipsum nulla, vulputate ut venenatis vitae, malesuada ut mi. Quisque iaculis, dui congue placerat pretium, augue erat accumsan lacus</p>
                                                        </div>
                                                    </div>
                                                    <div class="form-group row">
                                                        <div class="col">
                                                            <label class="col-form-label"><span class="text-danger">*</span> Your Name</label>
                                                            <input type="text" class="form-control" required>
                                                        </div>
                                                    </div>
                                                    <div class="form-group row">
                                                        <div class="col">
                                                            <label class="col-form-label"><span class="text-danger">*</span> Your Email</label>
                                                            <input type="email" class="form-control" required>
                                                        </div>
                                                    </div>
                                                    <div class="form-group row">
                                                        <div class="col">
                                                            <label class="col-form-label"><span class="text-danger">*</span> Your Review</label>
                                                            <textarea class="form-control" required></textarea>
                                                            <div class="help-block pt-10"><span class="text-danger">Note:</span> HTML is not translated!</div>
                                                        </div>
                                                    </div>
                                                    <div class="form-group row">
                                                        <div class="col">
                                                            <label class="col-form-label"><span class="text-danger">*</span> Rating</label>
                                                            &nbsp;&nbsp;&nbsp; Bad&nbsp;
                                                            <input type="radio" value="1" name="rating">
                                                            &nbsp;
                                                            <input type="radio" value="2" name="rating">
                                                            &nbsp;
                                                            <input type="radio" value="3" name="rating">
                                                            &nbsp;
                                                            <input type="radio" value="4" name="rating">
                                                            &nbsp;
                                                            <input type="radio" value="5" name="rating" checked>
                                                            &nbsp;Good
                                                        </div>
                                                    </div>
                                                    <div class="buttons">
                                                        <button class="sqr-btn" type="submit">Continue</button>
                                                    </div>
                                                </form> <!-- end of review-form -->
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div> 
                        <!-- product details reviews end --> 

                        <!-- related products area start -->
                        
                        <!-- related products area end -->
                    </div>

                    
                </div>
            </div>
        </div>
        <!-- product details wrapper end -->
        
        
        
        
        
  
  
        
<!--         +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ -->
			
<!-- 		滚动条 -->
		<div class="brand-area pt-34 pb-30">
            <div class="container">
                <div class="row">
                    <div class="col-12">
                        <div class="section-title mb-30">
                            <div class="title-icon">
                                <i class="fa fa-crop"></i>
                            </div>
                            <h3>或许你感兴趣的!</h3>
                        </div> <!-- section title end -->
                    </div>
                </div>
                <div class="row">
                    <div class="col-12">
                        <div class="brand-active slick-padding slick-arrow-style">
                            <div class="brand-item text-center">
                                <a href="#"><img src="<%=app %>/web/base/assets/img/brand/br1.png" alt=""></a>
                            </div>
                            <div class="brand-item text-center">
                                <a href="#"><img src="<%=app %>/web/base/assets/img/brand/br2.png" alt=""></a>
                            </div>
                            <div class="brand-item text-center">
                                <a href="#"><img src="<%=app %>/web/base/assets/img/brand/br3.png" alt=""></a>
                            </div>
                            <div class="brand-item text-center">
                                <a href="#"><img src="<%=app %>/web/base/assets/img/brand/br4.png" alt=""></a>
                            </div>
                            <div class="brand-item text-center">
                                <a href="#"><img src="<%=app %>/web/base/assets/img/brand/br5.png" alt=""></a>
                            </div>
                            <div class="brand-item text-center">
                                <a href="#"><img src="<%=app %>/web/base/assets/img/brand/br6.png" alt=""></a>
                            </div>
                            <div class="brand-item text-center">
                                <a href="#"><img src="<%=app %>/web/base/assets/img/brand/br4.png" alt=""></a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
<!-- 		滚动条 -->


        <!-- footer area start -->
        <footer>
            <!-- footer top start -->
            
            <!-- footer top end -->

            <!-- footer main start -->
            <div class="footer-widget-area pt-40 pb-38 pb-sm-10">
                <div class="container">
                    <div class="row">
                        <div class="col-md-3 col-sm-6">
                            <div class="footer-widget mb-sm-30">
                                <div class="widget-title mb-10 mb-sm-6">
                                    <h4>联系我们</h4>
                                </div>
                                <div class="widget-body">
                                    <ul class="location">
                                        <li><i class="fa fa-envelope"></i>debug@bug.com</li>
                                        <li><i class="fa fa-phone"></i>(404) 0123 456 789</li>
                                        <li><i class="fa fa-map-marker"></i>Address: xx省xx市xx区xxx号</li>
                                    </ul>
                                    <a class="map-btn" href="contact-us.html">在腾讯地图中打开我们</a>
                                </div>
                            </div> <!-- single widget end -->
                        </div> <!-- single widget column end -->
                        <div class="col-md-3 col-sm-6">
                            <div class="footer-widget mb-sm-30">
                                <div class="widget-title mb-10 mb-sm-6">
                                    <h4>我的账户</h4>
                                </div>
                                <div class="widget-body">
                                    <ul>
                                        <li><a href="#">我的</a></li>
                                        <li><a href="#">我的购物车</a></li>
                                        <li><a href="#">结账</a></li>
                                        <li><a href="#">我的愿望单</a></li>
                                        <li><a href="#">登录</a></li>
                                    </ul>
                                </div>
                            </div> <!-- single widget end -->
                        </div> <!-- single widget column end -->
                        <div class="col-md-3 col-sm-6">
                            <div class="footer-widget mb-sm-30">
                                <div class="widget-title mb-10 mb-sm-6">
                                    <h4>配送方式</h4>
                                </div>
                                <div class="widget-body">
                                    <ul>
                                        <li><a href="#">上门自取</a></li>
                                        <li><a href="#">配送服务查询</a></li>
                                        <li><a href="#">211限时达</a></li>
                                        <li><a href="#">配送费收取标准</a></li>
                                        <li><a href="#">海外配送</a></li>
                                    </ul>
                                </div>
                            </div> <!-- single widget end -->
                        </div> <!-- single widget column end -->
                        <div class="col-md-3 col-sm-6">
                            <div class="footer-widget mb-sm-30">
                                <div class="widget-title mb-10 mb-sm-6">
                                    <h4>售后服务</h4>
                                </div>
                                <div class="widget-body">
                                    <ul>
                                        <li><a href="#">售后政策</a></li>
                                        <li><a href="#">价格保护</a></li>
                                        <li><a href="#">退款声明</a></li>
                                        <li><a href="#">返修/退货款</a></li>
                                        <li><a href="#">取消订单</a></li>
                                    </ul>
                                </div>
                            </div> <!-- single widget end -->
                        </div> <!-- single widget column end -->
                    </div>
                </div>
            </div>
            <!-- footer main end -->

            <!-- footer bootom start -->
            <div class="footer-bottom-area bg-gray pt-20 pb-20">
                <div class="container">
                    <div class="footer-bottom-wrap">
                        <div class="copyright-text">
                            <p>Copyright (C) 2018 <a href="http://www.17sucai.com/">galio.com</a> All Rights Reserved.</p>
                        </div>
                        <div class="payment-method-img">
                            <img src="<%=app %>/web/base/assets/img/payment.png" alt="">
                        </div>
                    </div>
                </div>
            </div>
            <!-- footer bootom end -->

        </footer>
        <!-- footer area end -->

    </div>


    <!-- Quick view modal start -->
    <div class="modal" id="quick_view">
        <div class="modal-dialog modal-lg modal-dialog-centered">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                </div>
                <div class="modal-body">
                    <!-- product details inner end -->
                    <div class="product-details-inner">
                        <div class="row">
                            <div class="col-lg-5">
                                <div class="product-large-slider slick-arrow-style_2 mb-20">
                                    <div class="pro-large-img">
                                        <img src="<%=app %>/web/base/assets/img/product/product-details-img1.jpg" alt="" />
                                    </div>
                                    <div class="pro-large-img">
                                        <img src="<%=app %>/web/base/assets/img/product/product-details-img2.jpg" alt="" />
                                    </div>
                                    <div class="pro-large-img">
                                        <img src="<%=app %>/web/base/assets/img/product/product-details-img3.jpg" alt="" />
                                    </div>
                                    <div class="pro-large-img">
                                        <img src="<%=app %>/web/base/assets/img/product/product-details-img4.jpg" alt="" />
                                    </div>
                                    <div class="pro-large-img">
                                        <img src="<%=app %>/web/base/assets/img/product/product-details-img5.jpg" alt="" />
                                    </div>
                                </div>
                                <div class="pro-nav slick-padding2 slick-arrow-style_2">
                                    <div class="pro-nav-thumb"><img src="<%=app %>/web/base/assets/img/product/product-details-img1.jpg"
                                            alt="" /></div>
                                    <div class="pro-nav-thumb"><img src="<%=app %>/web/base/assets/img/product/product-details-img2.jpg"
                                            alt="" /></div>
                                    <div class="pro-nav-thumb"><img src="<%=app %>/web/base/assets/img/product/product-details-img3.jpg"
                                            alt="" /></div>
                                    <div class="pro-nav-thumb"><img src="<%=app %>/web/base/assets/img/product/product-details-img4.jpg"
                                            alt="" /></div>
                                    <div class="pro-nav-thumb"><img src="<%=app %>/web/base/assets/img/product/product-details-img5.jpg"
                                            alt="" /></div>
                                </div>
                            </div>
                            <div class="col-lg-7">
                                <div class="product-details-des mt-md-34 mt-sm-34">
                                    <h3><a href="product-details.html">external product 12</a></h3>
                                    <div class="ratings">
                                        <span class="good"><i class="fa fa-star"></i></span>
                                        <span class="good"><i class="fa fa-star"></i></span>
                                        <span class="good"><i class="fa fa-star"></i></span>
                                        <span class="good"><i class="fa fa-star"></i></span>
                                        <span><i class="fa fa-star"></i></span>
                                        <div class="pro-review">
                                            <span>1 review(s)</span>
                                        </div>
                                    </div>
                                    <div class="availability mt-10">
                                        <h5>Availability:</h5>
                                        <span>1 in stock</span>
                                    </div>
                                    <div class="pricebox">
                                        <span class="regular-price">$160.00</span>
                                    </div>
                                    <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod
                                        tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.<br>
                                        Phasellus id nisi quis justo tempus mollis sed et dui. In hac habitasse platea
                                        dictumst. Suspendisse ultrices mauris diam. Nullam sed aliquet elit. Mauris
                                        consequat nisi ut mauris efficitur lacinia.</p>
                                    <div class="quantity-cart-box d-flex align-items-center mt-20">
                                        <div class="quantity">
                                            <div class="pro-qty"><input type="text" value="1"></div>
                                        </div>
                                        <div class="action_link">
                                            <a class="buy-btn" href="#">add to cart<i class="fa fa-shopping-cart"></i>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- product details inner end -->
                </div>
            </div>
        </div>
    </div>
    <!-- Quick view modal end -->

    <!-- Scroll to top start -->
    <div class="scroll-top not-visible">
        <i class="fa fa-angle-up"></i>
    </div>
    <!-- Scroll to Top End -->



    <!--All jQuery, Third Party Plugins & Activation (main.js) Files-->
    <script src="<%=app %>/web/base/assets/js/vendor/modernizr-3.6.0.min.js"></script>
    <!-- Jquery Min Js -->
    <script src="<%=app %>/web/base/assets/js/vendor/jquery-3.3.1.min.js"></script>
    <!-- Popper Min Js -->
    <script src="<%=app %>/web/base/assets/js/vendor/popper.min.js"></script>
    <!-- Bootstrap Min Js -->
    <script src="<%=app %>/web/base/assets/js/vendor/bootstrap.min.js"></script>
    <!-- Plugins Js-->
    <script src="<%=app %>/web/base/assets/js/plugins.js"></script>
    <!-- Ajax Mail Js -->
    <script src="<%=app %>/web/base/assets/js/ajax-mail.js"></script>
    <!-- Active Js -->
    <script src="<%=app %>/web/base/assets/js/main.js"></script>
    <!-- Switcher JS [Please Remove this when Choose your Final Projct] -->
    
    
    
    
    
    
    <script type="text/javascript">
    
    	function getUrlParam(name) {
        	var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象
        	var r = window.location.search.substr(1).match(reg);  //匹配目标参数
        	if (r != null) return unescape(r[2]); return null; //返回参数值
    	};
    	var code = getUrlParam("code");
    	var zhanghao = getUrlParam("zhanghao");
    	console.log(code)
    	console.log(zhanghao)
    	var price;
    	init();
    	function init(){
    		$.ajax({
    			url:"<%=app %>/goodsB/list.do",
    			data:{code:code},
    			type:"post",
    			success:function(data){
    				console.log(data)
    				price=data[0].price;
//     				console.log(data[0].name)
    				var temp = "";
    				var html = "";
    				$.each(data,function(i,dom){
    				temp="<div class='row'>"
    				+"<div class='col-lg-6'>"
    				+"<div class='product-large-slider mb-20 slick-arrow-style_2'>"
    				+"<div class='pro-large-img img-zoom' id='img3'>"
    				+"<img src='<%=app %>/web/base/assets/img/product/"+dom.url+"' alt=''/>"
    				+"</div>"
    				+"</div>"
    				+"<div class='pro-nav slick-padding2 slick-arrow-style_2'>"
    				+"<div class='pro-nav-thumb'>"
    				+"<img src='<%=app %>/web/base/assets/img/product/"+dom.url+"' alt='' />"
    				+"</div>"
                    +"</div>"
    				+"</div>"
    				+"<div class='col-lg-6'>"
    				+"<div class='product-details-des mt-md-34 mt-sm-34' >"
                    +"<h3><a name='name'>"+data[0].name+"</a></h3>"
                    +"<div class='ratings'>"
                    +"<span class='good'><i class='fa fa-star'></i></span>"
                    +"<span class='good'><i class='fa fa-star'></i></span>"
                    +"<span class='good'><i class='fa fa-star'></i></span>"
                    +"<span class='good'><i class='fa fa-star'></i></span>"
                    +"<span><i class='fa fa-star'></i></span>"
                    +"<div class='pro-review'>"
                    +"<span>100 review(s)</span>"
                    +"</div>"
                    +"</div>"
                    +"<div class='customer-rev'>"
                    +"<a >(78 customer review)</a>"
                    +"</div>"
                    +"<div class='pricebox'>"
                    +"<span class='regular-price' id='55' name='price' >"+data[0].price+"</span>&nbsp;&nbsp;&nbsp;&nbsp;"
                    +"<span class='old-price'><del>¥"+(data[0].price*1.1)+"</del></span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;"
                    +"<span class='regular-price'>库存:"+data[0].num+"</span>"
                    +"</div>"
                    +"<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.<br>"
                    +"Phasellus id nisi quis justo tempus mollis sed et dui. In hac habitasse platea dictumst. Suspendisse ultrices mauris diam. Nullam sed aliquet elit. Mauris consequat nisi ut mauris efficitur lacinia.</p>"
                    +"<div class='quantity-cart-box d-flex align-items-center'>"
                    +"<div class='quantity'>"
                    +"<div class='pro-qty'><input type='text' name='number' placeholder='数目'></div>"
                    +"</div>"
                    +"<div class='action_link'>"
                    +"<a class='buy-btn' href='javascript:;' onclick='adds()'>添加到购物车<i class='fa fa-shopping-cart'></i></a>"
                    +"</div>"
                    +"</div>"
                    +"<div class='useful-links mt-20'>"
                    +"<a data-toggle='tooltip' data-placement='top' title='Compare'><i class='fa fa-refresh'></i>compare</a>"
                    +"<a data-toggle='tooltip' data-placement='top' title='Wishlist'><i class='fa fa-heart-o'></i>wishlist</a>"
                    +"</div>"
                    +"</div>"
                    +"</div>"
                    +"</div>"
                    
                    
                    
                    
    				})
    				$("div[name='stars']").html(temp);
    			}
    		})
    	}
    	
//     	console.log($("span"))
//     	console.log($("span[name='price']").attr("value"))
//     	console.log($("span[name='price']"))
//     	console.log(document.getElementsByTagName("span"))
//     	console.log(document.getElementsByTagName("span")[15])
//     	console.log(document.getElementsByName("price"))
//     	console.log(price)
// 		console.log($("input[name='number']").val())

		function adds(){
			if(zhanghao==null){
				alert("请先登录")
				location.href = "<%=app %>/web/front/login.jsp";
			}else{
				add();
			}
		}
    	function add(){
    		$.ajax({
    			url:"<%=app %>/mall/add.do",
    			data:{
    				"customerCode":getUrlParam("zhanghao"),
    				"goodsCode":getUrlParam("code"),
    				"price":$("span[name='price']").text(),
    				"num":$("input[name='number']").val(),
    				"name":$("a[name='name']").text()
    			},
    			type:"post",
    			success:function(data){
    				if(data=="1"){
    					alert("成功添加一件该商品到购物车")
    				}
    			}
    		})
<%-- 			location.href = "<%=app %>/web/front/login.jsp"; --%>
    	}
    	
    	
    	function search(){
    		location.href = "<%=app %>/web/front/commodity.jsp?zhanghao="+zhanghao+"";
    	}
    	function shopcar(){
    		location.href = "<%=app %>/web/front/shoppingcar.jsp?zhanghao="+zhanghao+"";
    	}
    	function my(){
    		location.href = "<%=app %>/web/front/mycount.jsp?zhanghao="+zhanghao+"";
    	}
//     	function search(){
<%--     		location.href = "<%=app %>/web/front/commodity.jsp"; --%>
//     	}
    </script>
</body>
</html>